<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width">
    <meta name="format-detection" content="telephone=yes"/>
    <title>报销</title>
    <link rel="stylesheet" href="../../css/reset.css">
    <link rel="stylesheet" href="../../css/base.css">
    <link rel="stylesheet" href="../../css/reimbursement.css">
    <style>
        .sx-box,.xz-box{display: inline-block;width: 49%;}
        .sx-box{text-align: left;}
        .xz-box{text-align: right;}
        .add-box{width: 97px;height: 22px;border-radius: 11px;background-color: #F5CE2F;color: #ffffff;text-align: center;line-height: 21px;}
.content1{text-align: center;overflow: hidden; width: 80%;height: 180px;background-color:#ffffff;border-radius: 10px;position: absolute;top: 20%;left: 10%; }
        .traffic-inp11{width: 39%;height: 29px;line-height: 29px;border: 1px solid #979797;text-align: center;border-radius: 2px;}
    .con1-sp{height: 55px;line-height: 55px;color: #3b3b3b;}
        .m-top{margin-top: 20px;}

    </style>
</head>
<body>
<div class="wrapper">
    <!--报销新增-->
    <!--无订单状态-->
    <div class="reim-search ">
        <div class="add-reimm b-btm">
            <div class="sx-box">
                <img src="../../images/Artboard%20103.png" alt="">
                <span class="ff5 fz9">筛选</span>
            </div>
            <div class="fr xz-box">
                <div class="add-box fr" onclick="add()">
                    <img src="../../images/Artboard 106.png" alt="">
                    <span class="fz9">新增报销</span>
                </div>

            </div>
        </div>
        <div class="search-box2 b-top">
            <img src="../../images/Artboard%2014@2x.png" alt="">
            <input type="search" class="search-inp" placeholder="搜索/关键字/词">
        </div>

    </div>
        <div class="reim-none hide1">
            <img src="../../images/Artboard%20102.png" alt="">
            <span>您还没有报销单!</span>
        </div>
<!--筛选-->
<div class="background hide1">
    <div class="content1">
        <span class="dis_b con1-sp fz11">请选择起始时间</span>
        <span class="dis_b con1-sp"><input type="text" id="demo1" class="traffic-inp11" placeholder="请选择日期">&nbsp;&nbsp;-&nbsp;&nbsp;<input id="demo2" class="traffic-inp11" type="text" placeholder="请选择日期"></span>
        <div class="sub-foot m-top">
            <span class="sub-sp1">确认</span>
            <span class="cancel">取消</span>
        </div>
    </div>
</div>
    <!--报销内容-->
    <div class="re-content">
        <div>
            <ul class="re-ul b-btm">
                <li class="f4 fz6" onclick="shz()">
                    <span >申请日期：<span>2017年6月13日</span><span>9:44:25</span></span>
                    <span class="fr"><span class="shz sh-box">审核中</span><img class="sh-more" src="../../images/Artboard%2013@3x.png" alt=""></span></li>
                <li class="f5 fz9">
                    <span>报销单号:</span>
                    <span class="fr">BX10180800001</span>
                </li>
                <li class="f5 fz9">
                    <span>订单项目号:</span>
                    <span class="fr">BX10180800001</span>
                </li>
                <li class="f5 fz9">
                    <span>客户:</span>
                    <span class="fr">上海家乐福</span>
                </li>
                <li class="fz9">
                    <span class="f5">报销总额:</span>
                    <span class="fr fe7">500.00</span>
                </li>
            </ul>
            <ul class="re-ul b-btm">
                <li class="f4 fz6">
                    <span >申请日期：<span>2017年6月13日</span><span>9:44:25</span></span>
                    <span class="fr"><span class="wtg sh-box">未通过</span><img class="sh-more" src="../../images/Artboard%2013@3x.png" alt=""></span></li>
                <li class="f5 fz9">
                    <span>报销单号:</span>
                    <span class="fr">BX10180800001</span>
                </li>
                <li class="f5 fz9">
                    <span>订单项目号:</span>
                    <span class="fr">BX10180800001</span>
                </li>
                <li class="f5 fz9">
                    <span>客户:</span>
                    <span class="fr">上海家乐福</span>
                </li>
                <li class="fz9">
                    <span class="f5">报销总额:</span>
                    <span class="fr fe7">500.00</span>
                </li>
            </ul>
            <ul class="re-ul b-btm">
                <li class="f4 fz6">
                    <span >申请日期：<span>2017年6月13日</span><span>9:44:25</span></span>
                    <span class="fr"><span class="ysh sh-box">已审核</span><img class="sh-more" src="../../images/Artboard%2013@3x.png" alt=""></span></li>
                <li class="f5 fz9">
                    <span>报销单号:</span>
                    <span class="fr">BX10180800001</span>
                </li>
                <li class="f5 fz9">
                    <span>订单项目号:</span>
                    <span class="fr">BX10180800001</span>
                </li>
                <li class="f5 fz9">
                    <span>客户:</span>
                    <span class="fr">上海家乐福</span>
                </li>
                <li class="fz9">
                    <span class="f5">报销总额:</span>
                    <span class="fr fe7">500.00</span>
                </li>
            </ul>
        </div>
    </div>

    <nav class="nav-list ">
        <a href="../index.html">
            <span><img src="../../images/Artboard%202%20Copy%205@3x.png" alt=""></span>
            <span >首页</span>
        </a>
        <a href="../Order/order.html">
            <span><img src="../../images/Artboard%202%20Copy%206@3x.png" alt=""></span>
            <span>订单</span>
        </a>
        <a href="javascript:void(0);">
            <span><img src="../../images/Artboard 2@2x.png" alt=""></span>
            <span class="list-col">报销</span>
        </a>
        <a href="../Personal/personal.html">
            <span><img src="../../images/Artboard 2 Copy@2x.png" alt=""></span>
            <span >个人</span>
        </a>
    </nav>
    <div class="prompt_box hide1" id="error" >
        <span class="prompt_span" id="errmsg"></span>
    </div>
</div>
<script src="../../js/jquery-2.1.4.min.js"></script>
<script src="../../js/base.js"></script>
<script src="../../js/data.js"></script>

<script>
function shz(){
    window.location.href='../Reimbursement/re-details.html';
}
function add(){
    window.location.href='../Reimbursement/re-relation.html';
}
var calendar = new datePicker();
calendar.init({
    'trigger': '#demo1', /*按钮选择器，用于触发弹出插件*/
    'type': 'date',/*模式：date日期；datetime日期时间；time时间；ym年月；*/
    'minDate':'1900-1-1',/*最小日期*/
    'maxDate':'2100-12-31',/*最大日期*/
    'onSubmit':function(){/*确认时触发事件*/
        var theSelectData=calendar.value;
    },
    'onClose':function(){/*取消时触发事件*/
    }
});
var calendar = new datePicker();
calendar.init({
    'trigger': '#demo2',
    'type': 'date',
    'minDate':'1900-1-1',
    'maxDate':'2100-12-31',
    'onSubmit':function(){
        var theSelectData=calendar.value;
    },
    'onClose':function(){
    }
});
$('.sub-sp1').click(function () {
    var demo1=$('#demo1').val();
    var demo2=$('#demo2').val();
    if(demo1==''||demo2==''){
        $("#errmsg").html('请选择日期');
        $("#error").show();
        errorHide();
        return
    }
    $('.background').hide();
});
$('.cancel').click(function () {
    $('.background').hide();
});
    $('.sx-box').click(function(){
        $('.background').show();
    });
</script>
</body>
</html>